import { ITodoData } from "./typing"
import { findParentNode } from './untils'
import TodoTemplate from './TodoTemplate'


class TodoDom extends TodoTemplate {
    // constructor(parameters) {

    // }
    private static instance: TodoDom
    public static create() {
        if (!TodoDom.instance) {
            return TodoDom.instance = new TodoDom()
        }
        return TodoDom.instance
    }

    public addItem(todo: ITodoData, target: HTMLElement): Promise<ITodoData> {
        return new Promise((resolve, rejecet) => {
            const oItem: HTMLElement = document.createElement('div')
            oItem.className = 'todo-item'
            oItem.innerHTML = this.todoView(todo)
            resolve(todo)
        })

    }

    public removeItem(target: HTMLElement): Promise<void> {
        return new Promise((resolve, reject) => {
            const oParentNode: HTMLElement = findParentNode(target, 'todo-item')
            oParentNode.remove()
            resolve()
        })
    }

    public changeComplete(target: HTMLElement, completed: boolean): Promise<void> {
        return new Promise((resolve, reject) => {
            const oParentNode: HTMLElement = findParentNode(target, 'todo-item')
            const oContent: HTMLElement = oParentNode.getElementsByTagName('span')[0]
            oContent.style.textDecoration = completed ? 'line-through' : 'none'
        })
    }
}
export default TodoDom